<template>
  <div class="fee-management">
    <!-- 收费管理标签页 -->
    <el-tabs v-model="activeTab" type="card" class="tabs">
      <!-- 收费项目类别 -->
      <el-tab-pane label="收费项目类别" name="category">
        <div class="operation-bar">
          <el-button type="primary" @click="handleCategoryAdd">新增</el-button>
          <div class="search-group" style="margin-left: auto;">
            <el-input v-model="categorySearch" placeholder="请输入收费项目类别" style="width: 240px;"
              @keyup.enter.native="loadCategoryData" />
            <el-button type="primary" icon="el-icon-search" @click="loadCategoryData"></el-button>
          </div>
        </div>
        <el-table :data="categoryTableData" border style="width: 100%; margin-bottom: 20px;"
          v-loading="categoryLoading">
          <el-table-column prop="categoryName" label="收费项目名称" />
          <el-table-column prop="remark" label="备注" />
          <el-table-column label="操作">
            <template slot-scope="scope">
              <el-button type="text" size="small" @click="handleCategoryEdit(scope.row)">编辑</el-button>
              <el-button type="danger" size="small" plain @click="handleCategoryDelete(scope.row)">删除</el-button>
            </template>
          </el-table-column>
        </el-table>
        <div class="pagination-wrap">
          <el-pagination @size-change="handleCategorySizeChange" @current-change="handleCategoryPageChange"
            :current-page="categoryPage.current" :page-sizes="[5, 10, 20, 30]" :page-size="categoryPage.size"
            layout="prev, pager, next, ->, jumper, ->, sizes, total" :total="categoryPage.total" />
        </div>

        <!-- 收费项目类别对话框 -->
        <el-dialog :title="categoryDialog.title" :visible.sync="categoryDialog.visible" width="500px">
          <el-form :model="categoryForm" label-width="120px">
            <el-form-item label="类别名称" prop="categoryName">
              <el-input v-model="categoryForm.categoryName" placeholder="请输入类别名称"></el-input>
            </el-form-item>
            <el-form-item label="备注" prop="remark">
              <el-input v-model="categoryForm.remark" type="textarea" placeholder="请输入备注"></el-input>
            </el-form-item>
          </el-form>
          <span slot="footer" class="dialog-footer">
            <el-button @click="categoryDialog.visible = false">取 消</el-button>
            <el-button type="primary" @click="submitCategoryForm">确 定</el-button>
          </span>
        </el-dialog>
      </el-tab-pane>

      <!-- 收费项目定义 -->
      <el-tab-pane label="收费项目定义" name="definition">
        <div class="operation-bar">
          <el-button type="primary" @click="handleDefinitionAdd">新建</el-button>
          <div class="search-group" style="margin-left: auto;">
            <el-input v-model="definitionSearch" placeholder="请输入收费项目" style="width: 240px;"
              @keyup.enter.native="loadDefinitionData" />
            <el-button type="primary" icon="el-icon-search" @click="loadDefinitionData"></el-button>
          </div>
        </div>
        <el-table :data="definitionTableData" border style="width: 100%; margin-bottom: 20px;"
          v-loading="definitionLoading">
          <el-table-column type="selection" />
          <el-table-column prop="chargeName" label="收费项目名称" />
          <el-table-column prop="chargeCategoryName" label="收费项目类别" />

          <el-table-column prop="remarks" label="备注" />
          <el-table-column label="操作">
            <template slot-scope="scope">
              <el-button type="text" size="small" @click="handleDefinitionEdit(scope.row)">编辑</el-button>
              <el-button type="danger" size="small" plain
                @click="handleDefinitionDelete(scope.row.chargeId)">删除</el-button>
            </template>
          </el-table-column>
        </el-table>
        <div class="pagination-wrap">
          <el-pagination @size-change="handleDefinitionSizeChange" @current-change="handleDefinitionPageChange"
            :current-page="definitionPage.current" :page-sizes="[5, 10, 20, 30]" :page-size="definitionPage.size"
            layout="prev, pager, next, ->, jumper, ->, sizes, total" :total="definitionPage.total" />
        </div>

        <!-- 收费项目定义对话框 -->
        <el-dialog :title="definitionDialog.title" :visible.sync="definitionDialog.visible" width="500px">
          <el-form :model="definitionForm" label-width="120px">
            <el-form-item label="收费项目名称" prop="chargeName">
              <el-input v-model="definitionForm.chargeName" placeholder="请输入收费项目名称"></el-input>
            </el-form-item>
            <el-form-item label="收费项目类别" prop="chargeCategoryName">
              <el-select v-model="definitionForm.chargeCategoryName" placeholder="请选择收费项目类别" style="width: 100%">
                <el-option v-for="item in categoryOptions" :key="item.id" :label="item.categoryName"
                  :value="item.categoryName"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="备注" prop="remarks">
              <el-input v-model="definitionForm.remarks" type="textarea" placeholder="请输入备注"></el-input>
            </el-form-item>
          </el-form>
          <span slot="footer" class="dialog-footer">
            <el-button @click="definitionDialog.visible = false">取 消</el-button>
            <el-button type="primary" @click="submitDefinitionForm">确 定</el-button>
          </span>
        </el-dialog>
      </el-tab-pane>

      <!-- 收费标准设置 -->
      <el-tab-pane label="收费标准设置" name="standard">
        <div class="operation-bar">
          <el-button type="primary" @click="handleStandardAdd">新建</el-button>
        </div>
        <el-table :data="standardTableData" border style="width: 100%; margin-bottom: 20px;"
          v-loading="standardLoading">
          <el-table-column type="selection" />
          <el-table-column prop="communityName" label="小区" />
          <el-table-column prop="chargeName" label="收费项目" />
          <el-table-column prop="standardName" label="收费标准名称" />
          <el-table-column prop="calculationMethod" label="金额计算方式" />
          <el-table-column prop="settingPrice" label="单价" />
          <el-table-column prop="measurementMethod" label="计量方式" />
          <el-table-column label="操作">
            <template slot-scope="scope">
              <el-button type="text" size="small" @click="handleStandardEdit(scope.row)">编辑</el-button>
              <el-button type="danger" size="small" plain
                @click="handleStandardDelete(scope.row.settingId)">删除</el-button>
            </template>
          </el-table-column>
        </el-table>
        <div class="pagination-wrap">
          <el-pagination @size-change="handleStandardSizeChange" @current-change="handleStandardPageChange"
            :current-page="standardPage.current" :page-sizes="[5, 10, 20, 30]" :page-size="standardPage.size"
            layout="prev, pager, next, ->, jumper, ->, sizes, total" :total="standardPage.total" />
        </div>

        <!-- 收费标准设置对话框 -->
        <el-dialog :title="standardDialog.title" :visible.sync="standardDialog.visible" width="600px">
          <el-form :model="standardForm" label-width="120px">
            <el-form-item label="小区" prop="communityId">
              <el-select v-model="standardForm.communityId" placeholder="请选择小区" style="width: 100%">
                <el-option v-for="item in communityOptions" :key="item.communityId" :label="item.communityName"
                  :value="item.communityId"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="收费项目" prop="chargeId">
              <el-select v-model="standardForm.chargeId" placeholder="请选择收费项目" style="width: 100%">
                <el-option v-for="item in chargeOptions" :key="item.chargeId" :label="item.chargeName"
                  :value="item.chargeId"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="收费标准名称" prop="standardName">
              <el-input v-model="standardForm.standardName" placeholder="请输入收费标准名称"></el-input>
            </el-form-item>
            <el-form-item label="金额计算方式" prop="calculationMethod">
              <el-select v-model="standardForm.calculationMethod" placeholder="请选择计算方式" style="width: 100%">
                <el-option label="单价X数量" value="单价X数量"></el-option>
                <el-option label="固定金额" value="固定金额"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="单价" prop="settingPrice" v-if="standardForm.calculationMethod === '单价X数量'">
              <el-input-number v-model="standardForm.settingPrice" :min="0" :precision="2"
                style="width: 100%"></el-input-number>
            </el-form-item>
            <el-form-item label="固定金额" prop="specifiedAmount" v-else>
              <el-input-number v-model="standardForm.specifiedAmount" :min="0" :precision="2"
                style="width: 100%"></el-input-number>
            </el-form-item>
            <el-form-item label="计量方式" prop="measurementMethod">
              <el-input v-model="standardForm.measurementMethod" placeholder="请输入计量方式"></el-input>
            </el-form-item>
            <el-form-item label="计费周期" prop="billingCycle">
              <el-select v-model="standardForm.billingCycle" placeholder="请选择计费周期" style="width: 100%">
                <el-option label="每月" value="每月"></el-option>
                <el-option label="每季度" value="每季度"></el-option>
                <el-option label="每年" value="每年"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="备注" prop="remarks">
              <el-input v-model="standardForm.remarks" type="textarea" placeholder="请输入备注"></el-input>
            </el-form-item>
          </el-form>
          <span slot="footer" class="dialog-footer">
            <el-button @click="standardDialog.visible = false">取 消</el-button>
            <el-button type="primary" @click="submitStandardForm">确 定</el-button>
          </span>
        </el-dialog>
      </el-tab-pane>

      <!-- 绑定收费标准 -->
      <el-tab-pane label="绑定收费标准" name="bind">
        <div class="operation-bar">
          <el-button type="primary" @click="handleBindAdd">添加收费标准</el-button>
        </div>
        <el-table :data="bindTableData" border style="width: 100%; margin-bottom: 20px;" v-loading="bindLoading">
          <el-table-column prop="pricingName" label="收费名称" />
          <el-table-column prop="chargeName" label="收费项目" />
          <el-table-column prop="settingName" label="收费标准名称" />
          <el-table-column prop="communityName" label="小区" />
          <el-table-column prop="remarks" label="备注" />
          <el-table-column label="操作">
            <template slot-scope="scope">
              <el-button type="text" size="small" @click="handleBindEdit(scope.row)">编辑</el-button>
              <el-button type="danger" size="small" plain @click="handleBindDelete(scope.row)">删除</el-button>
            </template>
          </el-table-column>
        </el-table>
        <div class="pagination-wrap">
          <el-pagination @size-change="handleBindSizeChange" @current-change="handleBindPageChange"
            :current-page="bindPage.current" :page-sizes="[5, 10, 20, 30]" :page-size="bindPage.size"
            layout="prev, pager, next, ->, jumper, ->, sizes, total" :total="bindPage.total" />
        </div>

        <!-- 绑定收费标准对话框 -->
        <el-dialog :title="bindDialog.title" :visible.sync="bindDialog.visible" width="700px">
          <el-form :model="bindForm" label-width="120px">
            <el-form-item label="收费方案名称" prop="pricingName">
              <el-input v-model="bindForm.pricingName" placeholder="请输入收费方案名称"></el-input>
            </el-form-item>
            <el-form-item label="小区" prop="communityId">
              <el-select v-model="bindForm.communityId" placeholder="请选择小区" style="width: 100%">
                <el-option v-for="item in communityOptions" :key="item.communityId" :label="item.communityName"
                  :value="item.communityId"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="收费项目" prop="chargeIds">
              <el-select v-model="bindForm.chargeIds" multiple placeholder="请选择收费项目" style="width: 100%">
                <el-option v-for="item in chargeOptions" :key="item.chargeId" :label="item.chargeName"
                  :value="item.chargeId"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="收费标准" prop="settingId">
              <el-select v-model="bindForm.settingId" placeholder="请选择收费标准" style="width: 100%">
                <el-option v-for="item in standardOptions" :key="item.settingId" :label="item.standardName"
                  :value="item.settingId"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="备注" prop="remarks">
              <el-input v-model="bindForm.remarks" type="textarea" placeholder="请输入备注"></el-input>
            </el-form-item>
          </el-form>
          <span slot="footer" class="dialog-footer">
            <el-button @click="bindDialog.visible = false">取 消</el-button>
            <el-button type="primary" @click="submitBindForm">确 定</el-button>
          </span>
        </el-dialog>
      </el-tab-pane>

      <!-- 自动账单日设置 -->
      <el-tab-pane label="自动账单日设置" name="billDate">
        <div class="setting-form">
          <el-form label-width="120px" style="margin-top: 20px;">
            <el-form-item label="每月自动生日">
              <el-select v-model="billDay" placeholder="请选择每月几号生成账单">
                <el-option v-for="i in 31" :key="i" :label="i + '号'" :value="i"></el-option>
              </el-select>
              <el-button type="primary" style="margin-left: 50px;" @click="saveBillDate">保存</el-button>
            </el-form-item>
          </el-form>
        </div>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
import request, { communityRequest } from '@/utils/request';

export default {
  name: 'FeeManagement',
  data() {
    return {
      activeTab: 'category',
      billDay: '',

      // 收费项目类别相关数据
      categorySearch: '',
      categoryLoading: false,
      categoryTableData: [],
      categoryPage: {
        current: 1,
        size: 5,
        total: 0
      },
      categoryDialog: {
        visible: false,
        title: '新增收费项目类别'
      },
      categoryForm: {
        id: '',
        categoryName: '',
        remark: ''
      },

      // 收费项目定义相关数据
      definitionSearch: '',
      definitionLoading: false,
      definitionTableData: [],
      definitionPage: {
        current: 1,
        size: 5,
        total: 0
      },
      definitionDialog: {
        visible: false,
        title: '新增收费项目定义'
      },
      definitionForm: {
        chargeId: '',
        chargeCategoryName: '',
        chargeName: '',
        remarks: ''
      },
      categoryOptions: [],

      // 收费标准设置相关数据
      standardLoading: false,
      standardTableData: [],
      standardPage: {
        current: 1,
        size: 5,
        total: 0
      },
      standardDialog: {
        visible: false,
        title: '新增收费标准'
      },
      standardForm: {
        settingId: '',
        communityId: '',
        chargeId: '',
        standardName: '',
        calculationMethod: '单价X数量',
        settingPrice: 0,
        measurementMethod: '',
        specifiedAmount: 0,
        billingCycle: '每月',
        remarks: ''
      },
      communityOptions: [],
      chargeOptions: [],

      // 绑定收费标准相关数据
      bindLoading: false,
      bindTableData: [],
      bindPage: {
        current: 1,
        size: 5,
        total: 0
      },
      bindDialog: {
        visible: false,
        title: '新增绑定收费标准'
      },
      bindForm: {
        pricingId: '',
        pricingName: '',
        chargeIds: [],
        settingId: '',
        communityId: '',
        remarks: ''
      },
      standardOptions: []
    }
  },
  created() {
    this.loadCategoryData();
    this.loadCommunityOptions();
  },
  watch: {
    activeTab(val) {
      if (val === 'definition') {
        this.loadDefinitionData();
        this.loadCategoryOptions();
      } else if (val === 'standard') {
        this.loadStandardData();
        this.loadChargeOptions();
      } else if (val === 'bind') {
        this.loadBindData();
      }
    }
  },
  methods: {
    // 加载小区选项
    loadCommunityOptions() {
      communityRequest.get('/community/selcomm').then(res => {
        this.communityOptions = res.data || [];
      });
    },

    // 加载收费项目类别选项
    loadCategoryOptions() {
      request.post('/feeCategory/getFeeCategoryList', {
        page: 1,
        size: 100
      }).then(res => {
        if (res.code === 200) {
          this.categoryOptions = res.data.records || [];
        }
      });
    },

    // 加载收费项目选项
    loadChargeOptions() {
      request.post('/chargedItems/list', {
        page: 1,
        size: 100
      }).then(res => {
        if (res.code === 200) {
          this.chargeOptions = res.data.records || [];
        }
      });
    },

    // 加载收费标准选项
    loadStandardOptions() {
      request.post('/settingOfChargedItems/list', {
        page: 1,
        size: 100
      }).then(res => {
        if (res.code === 200) {
          this.standardOptions = res.data.records || [];
        }
      });
    },

    // ========== 收费项目类别相关方法 ==========
    loadCategoryData() {
      this.categoryLoading = true;
      request.post('/feeCategory/getFeeCategoryList', {
        page: this.categoryPage.current,
        size: this.categoryPage.size
      }).then(res => {
        if (res.code === 200) {
          this.categoryTableData = res.data.records || [];
          this.categoryPage.total = res.data.total || 0;
        }
      }).finally(() => {
        this.categoryLoading = false;
      });
    },

    handleCategoryAdd() {
      this.categoryDialog.title = '新增收费项目类别';
      this.categoryForm = {
        id: '',
        categoryName: '',
        remark: ''
      };
      this.categoryDialog.visible = true;
    },

    handleCategoryEdit(row) {
      this.categoryDialog.title = '编辑收费项目类别';
      this.categoryForm = {
        id: row.id,
        categoryName: row.categoryName,
        remark: row.remark
      };
      this.categoryDialog.visible = true;
    },

    submitCategoryForm() {
      request.post('/feeCategory/updateFeeCategory', this.categoryForm).then(res => {
        if (res.code === 200) {
          this.$message.success('操作成功');
          this.categoryDialog.visible = false;
          this.loadCategoryData();
        } else {
          this.$message.error(res.message || '操作失败');
        }
      });
    },

    handleCategoryDelete(row) {

      this.$confirm('确定要删除该收费项目类别吗?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {

        request.delete(`/feeCategory/deleteFeeCategory?id=${row.id}`).then(res => {
          if (res.code === 200) {
            this.$message.success('删除成功');
            this.loadCategoryData();
          } else {
            this.$message.error(res.message || '删除失败');
          }
        });
      }).catch(() => { });
    },

    handleCategorySizeChange(val) {
      this.categoryPage.size = val;
      this.loadCategoryData();
    },

    handleCategoryPageChange(val) {
      this.categoryPage.current = val;
      this.loadCategoryData();
    },

    // ========== 收费项目定义相关方法 ==========
    loadDefinitionData() {
      this.definitionLoading = true;
      request.post('/chargedItems/list', {
        page: this.definitionPage.current,
        size: this.definitionPage.size,
        chargeName: this.definitionSearch
      }).then(res => {
        if (res.code === 200) {
          this.definitionTableData = res.data.records || [];
          this.definitionPage.total = res.data.total || 0;
        }
      }).finally(() => {
        this.definitionLoading = false;
      });
    },

    handleDefinitionAdd() {
      this.definitionDialog.title = '新增收费项目定义';
      this.definitionForm = {
        chargeId: '',
        chargeCategoryName: '',
        chargeName: '',
        remarks: ''
      };
      this.definitionDialog.visible = true;
    },

    handleDefinitionEdit(row) {
      this.definitionDialog.title = '编辑收费项目定义';
      this.definitionForm = {
        chargeId: row.chargeId,
        chargeCategoryName: row.chargeCategoryName,
        chargeName: row.chargeName,
        remarks: row.remarks
      };
      this.definitionDialog.visible = true;
    },

    submitDefinitionForm() {
      const api = this.definitionForm.chargeId ? '/chargedItems/update' : '/chargedItems/add';
      request.post(api, this.definitionForm).then(res => {
        if (res.code === 200) {
          this.$message.success('操作成功');
          this.definitionDialog.visible = false;
          this.loadDefinitionData();
        } else {
          this.$message.error(res.message || '操作失败');
        }
      });
    },

    handleDefinitionDelete(id) {
      this.$confirm('确定要删除该收费项目定义吗?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        request.delete(`/chargedItems/delete?id=${id}`).then(res => {
          if (res.code === 200) {
            this.$message.success('删除成功');
            this.loadDefinitionData();
          } else {
            this.$message.error(res.message || '删除失败');
          }
        });
      }).catch(() => { });
    },

    handleDefinitionSizeChange(val) {
      this.definitionPage.size = val;
      this.loadDefinitionData();
    },

    handleDefinitionPageChange(val) {
      this.definitionPage.current = val;
      this.loadDefinitionData();
    },

    // ========== 收费标准设置相关方法 ==========
    loadStandardData() {
      this.standardLoading = true;
      request.post('/settingOfChargedItems/list', {
        page: this.standardPage.current,
        size: this.standardPage.size
      }).then(res => {
        if (res.code === 200) {
          this.standardTableData = res.data.records || [];
          this.standardPage.total = res.data.total || 0;
        }
      }).finally(() => {
        this.standardLoading = false;
      });
    },

    handleStandardAdd() {
      this.standardDialog.title = '新增收费标准';
      this.standardForm = {
        settingId: '',
        communityId: '',
        chargeId: '',
        standardName: '',
        calculationMethod: '单价X数量',
        settingPrice: 0,
        measurementMethod: '',
        specifiedAmount: 0,
        billingCycle: '每月',
        remarks: ''
      };
      this.standardDialog.visible = true;
    },

    handleStandardEdit(row) {
      this.standardDialog.title = '编辑收费标准';
      this.standardForm = {
        settingId: row.settingId,
        communityId: row.communityId,
        chargeId: row.chargeId,
        standardName: row.standardName,
        calculationMethod: row.calculationMethod,
        settingPrice: row.settingPrice,
        measurementMethod: row.measurementMethod,
        specifiedAmount: row.specifiedAmount || 0,
        billingCycle: row.billingCycle,
        remarks: row.remarks
      };
      this.standardDialog.visible = true;
    },

    submitStandardForm() {
      request.post('/settingOfChargedItems/update', this.standardForm).then(res => {
        if (res.code === 200) {
          this.$message.success('操作成功');
          this.standardDialog.visible = false;
          this.loadStandardData();
        } else {
          this.$message.error(res.message || '操作失败');
        }
      });
    },

    handleStandardDelete(id) {
      this.$confirm('确定要删除该收费标准吗?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        request.delete(`/settingOfChargedItems/delete?settingId=${id}`).then(res => {
          if (res.code === 200) {
            this.$message.success('删除成功');
            this.loadStandardData();
          } else {
            this.$message.error(res.message || '删除失败');
          }
        });
      }).catch(() => { });
    },

    handleStandardSizeChange(val) {
      this.standardPage.size = val;
      this.loadStandardData();
    },

    handleStandardPageChange(val) {
      this.standardPage.current = val;
      this.loadStandardData();
    },

    // ========== 绑定收费标准相关方法 ==========
    loadBindData() {
      this.bindLoading = true;
      request.post('/pricing/list', {
        page: this.bindPage.current,
        size: this.bindPage.size
      }).then(res => {
        if (res.code === 200) {
          this.bindTableData = res.data.records || [];
          this.bindPage.total = res.data.total || 0;
        }
      }).finally(() => {
        this.bindLoading = false;
      });
    },

    handleBindAdd() {
      this.loadStandardOptions();
      this.bindDialog.title = '新增绑定收费标准';
      this.bindForm = {
        pricingId: '',
        pricingName: '',
        chargeIds: [],
        settingId: '',
        communityId: '',
        remarks: ''
      };
      this.bindDialog.visible = true;
    },

    handleBindEdit(row) {
      this.loadStandardOptions();
      request.get(`/pricing/getprice?pricingId=${row.pricingId}`).then(res => {
        if (res.code === 200) {
          this.bindDialog.title = '编辑绑定收费标准';
          this.bindForm = {
            pricingId: row.pricingId,
            pricingName: row.pricingName,
            chargeIds: res.data.settingList.map(item => item.chargeId),
            settingId: row.settingId,
            communityId: row.communityId,
            remarks: row.remarks
          };
          this.bindDialog.visible = true;
        }
      });
    },

    submitBindForm() {
      request.post('/pricing/update', this.bindForm).then(res => {
        if (res.code === 200) {
          this.$message.success('操作成功');
          this.bindDialog.visible = false;
          this.loadBindData();
        } else {
          this.$message.error(res.message || '操作失败');
        }
      });
    },

    handleBindDelete(row) {
      this.$confirm('确定要删除该绑定收费标准吗?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        request.delete(`/pricing/delete?pricingId=${row.pricingId}`).then(res => {
          if (res.code === 200) {
            this.$message.success('删除成功');
            this.loadBindData();
          } else {
            this.$message.error(res.message || '删除失败');
          }
        });
      }).catch(() => { });
    },

    handleBindSizeChange(val) {
      this.bindPage.size = val;
      this.loadBindData();
    },

    handleBindPageChange(val) {
      this.bindPage.current = val;
      this.loadBindData();
    },

    // 保存自动账单日
    saveBillDate() {
      if (this.billDay) {
        this.$message({
          message: `已设置每月${this.billDay}号生成账单`,
          type: 'success'
        });
      } else {
        this.$message.warning('请选择账单生成日期');
      }
    }
  }
}
</script>

<style scoped>
.fee-management {
  padding: 20px;
}

.tabs {
  margin-bottom: 15px;
}

.operation-bar {
  display: flex;
  align-items: center;
  margin-bottom: 15px;
}

.search-group {
  display: flex;
  align-items: center;
}

.search-group .el-input {
  margin-right: 8px;
}

.setting-form {
  width: 600px;
}

.pagination-wrap {
  display: flex;
  justify-content: flex-end;
  margin-top: 15px;
}
</style>
